<template>
	<div class="role">

		<el-dialog :title="title" :visible="dialogFormVisible" :close-on-click-modal="false" width="700px" :before-close="handleClose">
			<div class="tab">
				<el-form
					:model="form"
					:rules="rules"
					ref="baseForm"
					label-width="150px">
					<el-form-item label="产品线" required>
						<el-select
							prop="lineId"
							v-model="lineId"
							placeholder="请选择产品线"
							style="width:100%;"
							:disabled="num == 3">
							<el-option
								v-for="item in options"
								:key="item.index"
								:label="item.name"
								:value="item.name">
							</el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="产品名称" prop="name">
						<el-input
							v-model="form.name"
							placeholder="请输入邮箱"
							:disabled="num == 3"
						></el-input>
					</el-form-item>
					<el-form-item label="产品状态">
						<el-select v-model="form.status" placeholder="请选择状态" style="width:100%;" :disabled="num == 3">
							<el-option label="禁用" :value="0"></el-option>
							<el-option label="正常" :value="1"></el-option>
						</el-select>
					</el-form-item>
				</el-form>
			</div>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="add('form')" v-if="this.num != 3">提 交</el-button>
				</div>
		</el-dialog>
	</div>

</template>

<script>
import { getHeader } from '@/app.config'
export default {
	name: 'retestTask',
	data(){
		return {
			dialogFormVisible:false,
			form:{},
			lineId:'',
			rules:{
				lineId:[{required: true, message: '请选择产品线', trigger: 'change'}],
				name: [
					{max: 36, message: '产品名称不能超过36个字符', trigger: 'blur'},
					{ required: true, message: '请输入产品名', trigger: 'blur' }
				],
			},
			num:'0',
			id:'',
			title:'',
			options:[]
		}
	},
	created() {

	},
	methods:{
		add(){
			var data = this.form

			this.options.filter(item => {
				if(item['name'] == this.lineId){
					this.form.product_line_id = item['id']
				}
			})

			var source = `${process.env.VUE_APP_KANBAN_HOST}/api/v1/product/${this.id}`;
			this.$axios.post(source,data,{headers: getHeader()})
				.then((response) => {
					if (response.status == 200) {
						this.dialogFormVisible = false
						this.form = {}
						this.$parent.initTable()
						this.$message.success("修改成功!")
					}
				}).catch((err) => {
				console.log(err);
			});
		},
		handleClose(){
			this.dialogFormVisible = false
			this.form = {}
		},
		initData(num,data){
			this.num = num
			this.id = data.id

			var source = `${process.env.VUE_APP_KANBAN_HOST}/api/v1/product/line/list`;
			this.$axios.get(source,{headers: getHeader()})
				.then((response) => {
					if (response.status == 200) {
						console.log(response.data.data,23232)
						this.options = response.data.data
					}
				}).catch((err) => {
				console.log(err);
			});

			if(num == 2){
				this.title = '编辑'
			}else {
				this.title = '查看'
			}

			if(num == 3 || num == 2){
				this.form = Object.assign({},data)
				this.lineId = data.product_line['name']
			}
		}
	}

}
</script>

<style lang="scss" scoped>
.role{
	.role{
		.tab{
			width: 560px;
			//margin: 0 0 0 40px;
		}
	}
}
</style>
